{extend name="public/base" /}

{block name="content"}
<!--页面路径 和 页面标题-->
<div class="page-title">

    <div class="title-env">
        <h1 class="title">专栏分类管理</h1>
        <p class="description">所有分类</p>
    </div>

    <div class="breadcrumb-env">

        <ol class="breadcrumb bc-1">
            <li>
                <a href="/admin"><i class="fa-home"></i>Home</a>
            </li>
            <li>
                <a href="/admin/video/index">视频管理</a>
            </li>
            <li class="active">
                <strong>专栏分类列表</strong>
            </li>
        </ol>

    </div>

</div>

<div class="row">
    <div class="col-md-12">

        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">分类列表</font></font></h3>
                <div class="panel-options">
                    <button class="btn btn-icon btn-danger" id="deleted_all">
                        <i class="fa-trash"></i> 批量删除
                    </button>

                    <button class="btn btn-icon btn-success" data-toggle="modal" data-target="#add-cate">
                        <i class="fa-plus"></i> 添加分类
                    </button>
                </div>
            </div>

            <div class="panel-body panel-border">
                <div class="row">
                    <div class="col-sm-12">
                        <table class="table">
                            <thead>
                            <tr>
                                <th>
                                    <input id="CheckAll" name='CheckAll' type='checkbox'> 序号
                                </th>
                                <th>名字</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            {foreach $lists as $key => $list}
                            <tr>
                                <td>
                                    <input type="checkbox" name="ids[]" value="{$list.id}" style="margin-right: 5px;">
                                    {$key + 1}
                                </td>
                                <td>{$list.name}</td>
                                <td>
                                    <input type="checkbox" onclick="change_status({$list.id},'cate','status')" {if condition="$list.status == 1"}checked{/if}  class="iswitch iswitch-success">
                                </td>
                                <td>
                                    <button class="btn btn-icon btn-success" data-toggle="modal" data-target="#edit-cate" data-id="{$list.id}">
                                        <i class="fa-edit"></i>
                                    </button>

                                    <button class="btn btn-icon btn-red" onclick="deleted({$list.id},'cate')">
                                        <i class="fa-trash"></i>
                                    </button>
                                </td>
                            </tr>
                            {/foreach}
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="row">
                    <label class="col-md-6 control-label">共 {$lists->total()} 条记录</label>
                    <div class="col-md-6 text-right">
                        <nav aria-label="Page navigation">
                            {$lists->render()}
                        </nav>
                    </div>
                </div>
            </div>

        </div>

    </div>
</div>
{/block}

{block name="modal"}

<!--添加分类模态框-->
<div class="modal fade" id="add-cate" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <form id="add-form" method="post" class="form-horizontal" action="/admin/video/addCate" id="add-form">
            <div class="modal-content">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">添加分类</h4>
                </div>

                <div class="modal-body">
                    <div class="row">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">名字</label>
                            <div class="col-sm-6">
                                <input type="text" class="form-control" name="name">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">状态</label>
                            <div class="col-sm-6">
                                <label class="radio-inline"><input type="radio" name="status" checked="1" value="1">发布</label>
                                <label class="radio-inline"><input type="radio" name="status" value="2">隐藏</label>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                    <input type="button" class="btn btn-info" id="add-button" value="Save changes">
                </div>
            </div>
        </form>
    </div>
</div>


<!--编辑分类模态框-->

<div class="modal fade" id="edit-cate" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <form id="edit-form" method="post" class="form-horizontal" action="/admin/video/editCatePost" id="edit-form">
            <div class="modal-content">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">编辑分类</h4>
                </div>

                <div class="modal-body">
                    <input type="hidden" name="id" id="cate_id" value="">
                    <div class="row">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">名字</label>
                            <div class="col-sm-6">
                                <input type="text" class="form-control" name="name" id="name">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">状态</label>
                            <div class="col-sm-6">
                                <label class="radio-inline"><input type="radio" name="status" checked="1" value="1">发布</label>
                                <label class="radio-inline"><input type="radio" name="status" value="2">隐藏</label>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                    <input type="button" class="btn btn-info" id="edit-button" value="Save changes">
                </div>
            </div>
        </form>
    </div>
</div>
{/block}

{block name="js"}
<script>
    $('#edit-cate').on('show.bs.modal', function (event) {
        var button = $(event.relatedTarget);
        var id = button.data('id');
        var modal = $(this);
        $.ajax({
            url:'/admin/video/editCate',
            method: 'POST',
            dataType: 'json',
            data:{
                id:id,
            },
            success: function(res)
            {
                if(res.code == 0) {
                    modal.find('.modal-body #cate_id').val(res.data.id);
                    modal.find('.modal-body #order').val(res.data.order);
                    modal.find('.modal-body #name').val(res.data.name);
                    $("#edit-cate :radio[name='status'][value='" + res.data.status + "']").prop("checked", "checked");
                }else{
                    error(res.message);
                }
            }
        });
    });

    //添加分类表单提交
    $("#add-button").click(function(){
        var targetUrl = $("#add-form").attr("action");
        var data = $("#add-form").serialize();
        $.ajax({
            type:'post',
            url:targetUrl,
            cache: false,
            data:data,
            dataType:'json',
            success:function(data){
                if(data.code == 0) {
                    success(data.message);
                    setTimeout("location.reload()",1000);
                }else{
                    error(data.message);
                }
            }
        })
    });

    //编辑分类表单提交
    $("#edit-button").click(function(){
        var targetUrl = $("#edit-form").attr("action");
        var data = $("#edit-form").serialize();
        $.ajax({
            type:'post',
            url:targetUrl,
            cache: false,
            data:data,
            dataType:'json',
            success:function(data){
                if(data.code == 0) {
                    success(data.message);
                    setTimeout("location.reload()",1000);
                }else{
                    error(data.message);
                }
            }
        })
    });

    //更改状态
    function change_status(id,type,field) {
        $.ajax({
            url:'/admin/video/changeStatus',
            method: 'POST',
            dataType: 'json',
            data:{
                id:id,
                type:type,
                field:field
            },
            success: function(res)
            {
                if(res.code != 0) {
                    error(res.message);
                }
            }
        })
    };

    //删除视频
    function deleted(id,type) {
        if(confirm("是否确认删除")){
            $.ajax({
                url:'/admin/video/deleted',
                method: 'POST',
                dataType: 'json',
                data:{
                    id:id,
                    type:type
                },
                success: function(res)
                {
                    if(res.code == 0) {
                        success(res.message);
                        setTimeout("location.reload()",1000);
                    }else{
                        error(res.mssage);
                    }
                }
            })
        }
    };


    //批量删除
    $("#deleted_all").click(function(){
        if(confirm('确定要删除所选吗?')){
            var checks = $("input[name='ids[]']:checked");
            if(checks.length == 0){ alert('未选中任何项！');return false;}
            //将获取的值存入数组
            var checkData = new Array();
            checks.each(function(){
                checkData.push($(this).val());
            });
            $.ajax({
                url:'/admin/video/deleted',
                method: 'POST',
                dataType: 'json',
                data:{
                    ids:checkData.toString(),
                    type:'cate'
                },
                success: function(res)
                {
                    if(res.code == 0) {
                        success(res.message);
                        setTimeout("location.reload()",1000);
                    }else{
                        error(res.message);
                    }
                }
            });
        }
    });
    
</script>
{/block}